<template>
 <view>
 <my-navbar :mTitle="mTitle"></my-navbar>
 
 <view style="margin: 40rpx 80rpx">
 <u-form :model="form" ref="uForm">
 <u-form-item>
 <wInput v-model="form.username" type="number" maxlength="11" placeholder="微信号" focus></wInput>
 </u-form-item>
 <u-form-item>
 <wInput v-model="form.password" type="password" placeholder="登录密码"></wInput>
 </u-form-item>
 </u-form>
 <view style="margin-top: 40rpx;">
 <u-button @click="submit()" plain="false" type="info" shape="circle" hair-line="false">登录</u-button>
 </view>
 
 <view class="u-text-center u-line-1 u-font-14" style="margin-top: 20rpx;color: #24292E;">
 <text @click="register">注册账号</text>
 </view>
 </view>
 
 <!-- 新增的错误提示 -->
 <view v-if="errorMessage" class="error-message" style="margin-top: 40rpx; color: red; text-align: center;">
 {{ errorMessage }}
 </view>
 </view>
</template>
<script>
export default {
 data() {
 return {
 mTitle: '登 录',
 form: {
 username: '',
 password: ''
 },
 errorMessage: '' // 新增的用于存储错误信息的变量
 }
 },
 onLoad() {
 },
 onShow() {
 // 每次显示页面时清除错误信息
 this.errorMessage = '';
 },
 methods: {
 submit() {
 // 模拟账号验证过程
 const mockUsers = [{ username: '123456', password: '123' }]; // 示例用户数据
 const user = mockUsers.find(u => u.username === this.form.username && u.password === this.form.password);
 
 if (user) {
 console.log('登录成功');
 this.$u.route('/pages/authorize/authorize');
 } else {
 this.errorMessage = '账号密码错误，如果没有账号请注册'; // 设置错误信息
 }
 },
 register() {
 // 导航到注册页面
 this.$u.route('/pages/register/register');
 },
 }
}
</script>
<style lang="scss">
.error-message {
 font-size: 14px;
}
</style>